<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>档案管理系统</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">

    <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/static/dist/css/font-awesome.min.css">
    <link rel="stylesheet" href="/static/dist/css/ionicons.min.css">
    <link rel="stylesheet" href="/static/dist/css/AdminLTE.min.css">
    <link rel="stylesheet" href="/static/dist/css/skins/all-skins.min.css">
    <link rel="stylesheet" href="/static/css/bootstrap-treeview.css">
    <link rel="stylesheet" href="/static/css/bootstrapValidator.min.css">
    <link rel="stylesheet" href="/static/css/bootstrap-table.min.css">
    <link rel="stylesheet" href="/static/layer/theme/default/layer.css">
    <link rel="stylesheet" href="/static/css/viewer.min.css">
    <link rel="stylesheet" href="/static/webCss/wsxq.css?v=shujubuwqd12138">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="/static/plugins/ie9/html5shiv.min.js"></script>
    <script src="/static/plugins/ie9/respond.min.js"></script>
    <![endif]-->
</head>
<body class="hold-transition skin-blue" style="font-size: medium">


<div class="content " id="yhgl">
    <div class="row">
        <!--借阅详情或登记-->
        <div class="modal" id="jyDiv" data-backdrop="static">
            <div class="modal-dialog" style="width: 600px;height: 600px">
                <!--<span class="btn btn-primary" data-original=""></span>-->
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title">信息</h4>
                    </div>
                    <div class="modal-body row" style="padding-left: 40px">
                        <label>是否要借阅该档案？</label>
                    </div>
                    <div class="modal-footer">
                        <div class="text-center">
                            <a class="btn btn-primary" style="background-color: #2C75E8;width: 118px;height: 30px;border-radius:2px 0px 0px 2px;padding: 2px;margin-left: 60px;" @click="sureJy">确定</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal" id="jydjDiv" data-backdrop="static">
            <div class="modal-dialog" style="width: 800px;height: 600px">
                <!--<span class="btn btn-primary" data-original=""></span>-->
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title">请选择要借阅的档案</h4>
                    </div>
                    <div class="modal-body row">
                        <div class="col-xs-8 col-xs-offset-2" style="height:500px;overflow:auto">
                            <div id="dadjtree"></div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <div class="text-center">
                            <button type="button" class="btn btn-primary" @click="suredj" style="width: 94px;height: 36px;background-color: #2C72E8">确定</button>
                            <button type="button" class="btn btn-default" @click="canceldj" style="width: 94px;height: 36px">取消</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-xs-3 left">
            <div class="row" style="height: 54px;border-bottom: 1px solid #E0E0E0">
                <label class="col-xs-4" style="color: #3A3A3A;font-weight: 600;padding-top: 17px;font-size: 16px">档案材料</label>
            </div>
            <div style="height: 700px;overflow: auto">
                <div id="tree2"></div>
            </div>
        </div>
        <div class="col-xs-9 right">
            <div class="row" style="height: 54px;border-bottom: 1px solid #E0E0E0">
                <label class="col-xs-4" style="color: #3A3A3A;font-weight: 600;padding-top: 17px;font-size: 16px">档案基本信息</label>
            </div>
            <div v-show="da">
                <div class="row">
                    <div class="form-group col-xs-6">
                        <label>档案编号*</label>
                        <input readonly name="dabh" v-model="showWs.dabh" type="text"
                               class="form-control input-sm">
                    </div>
                    <div class="form-group col-xs-3">
                        <label>时间</label>
                        <input readonly v-model="showWs.sj" name="sj" type="text"
                               class="form-control input-sm">
                    </div>
                    <div class="form-group col-xs-3">
                        <label>文号</label>
                        <input readonly v-model="showWs.wh" name="wh" type="text"
                               class="form-control input-sm">
                    </div>
                    <div class="form-group col-xs-12">
                        <label>案卷题名*</label>
                        <input readonly v-model="showWs.wjmc" name="wjmc" type="text"
                               class="form-control input-sm">
                    </div>
                    <div class="form-group col-xs-12">
                        <label>单位名称</label>
                        <input readonly v-model="showWs.dwmc" name="dwmc" type="text"
                               class="form-control input-sm">
                    </div>
                    <div class="form-group col-xs-6">
                        <label>登记人</label>
                        <input v-model="showWs.djr" name="djr" type="text" readonly
                               class="form-control input-sm">
                    </div>
                    <div class="form-group col-xs-6">
                        <label>登记时间</label>
                        <input v-model="showWs.inputtime" name="inputtime" type="text" readonly
                               class="form-control input-sm">
                    </div>
                    <div class="form-group col-xs-3">
                        <label>年份*</label>
                        <input readonly v-model="showWs.nf" name="nf" type="text"
                               class="form-control input-sm">
                    </div>
                    <div class="form-group col-xs-3">
                        <label>页数</label>
                        <input readonly v-model="showWs.ys" name="ys" type="text"
                               class="form-control input-sm">
                    </div>
                    <div class="form-group col-xs-3">
                        <label>总盒号</label>
                        <input readonly v-model="showWs.zhh" name="zhh" type="text"
                               class="form-control input-sm">
                    </div>
                    <div class="form-group col-xs-3">
                        <label>页号</label>
                        <input readonly v-model="showWs.yh" name="yh" type="text"
                               class="form-control input-sm">
                    </div>
                    <div class="form-group col-xs-12">
                        <label>备注</label>
                        <textarea readonly v-model="showWs.bz" name="qzh" type="text" class="form-control input-sm"></textarea>
                    </div>
                </div>
            </div>
            <div v-show="cl">
                材料信息
            </div>
        </div>

    </div>

</div>

<script src="/static/plugins/jQuery/jquery-2.2.3.min.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="/static/bootstrap/js/bootstrap.min.js"></script>
<!-- Slimscroll -->
<script src="/static/plugins/slimScroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="/static/plugins/fastclick/fastclick.js"></script>

<!-- AdminLTE App -->
<script src="/static/dist/js/app.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="/static/dist/js/demo.js"></script>
<!--tabs-->
<script src="/static/dist/js/app_iframe.js"></script>
<script src="/static/js/bootstrap-treeview.js"></script>
<script src="/static/js/bootstrapValidator.min.js"></script>
<script src="/static/js/bootstrap-table.min.js"></script>
<script src="/static/js/bootstrap-table-zh-CN.js"></script>
<script src="/static/js/vue.js"></script>
<script src="/static/js/vue-resource.min.js"></script>
<script src="/static/layer/layer.js"></script>
<script src="/static/js/myJs.js?v=shujubuwqd12138"></script>
<script src="/static/js/viewer.min.js"></script>
<script src="/static/js/newJs.js?v=shujubuwqd12138"></script>
<!--<script src="/static/js/jquery-viewer.js"></script>-->

<script type="text/javascript">
    newCss("/static/webCss/wsxq.css");
    var id;
    var Id;
    var vue = new Vue({
        el: '#yhgl',
        data: {
            showWs:{
                typeName:null,
                //files:[],
                //id:null,
                dabh:null,//档案编号
                wh:null,//文号
                yh:null,//页号
                ys:null,//页数
                zhh:null,//总盒号
                type_name:null,//档案类型
                typeId:null,//档案类型id
                dwmc:null,//单位名称
                sj:null,//时间
                nf:null,//年份
                bz:null,
                inputtime:null,
                djr:null,
            },
            cl:false,
            da:true,
            allShy:null,
            role:null,
            jyxx2:{
                clxxIds:[],
                jyyy:null,
                jysx:5,
                dabh:null,
                jyrLxdh:null,
                jyr:null,
                shrLxdh:null,
                shrId:null,
                shr:null,
                damc:null,
                dalx:null,
            },
        },
        methods: {
            //sureJy确定借阅
            sureJy:function(){
                $('#jyDiv').modal('hide');
                this.$http.get('/listShUser').then( function (result) {
                    var data = result.body;
                    if(data.code == 200){
                        this.allShy = data.data;
                        if(data.data.length == 0){
                            cxAlert("尚未添加审核人，请先添加审核人");
                        }else {
                            vue.$data.jyxx2.shrId = data.data[0].id;
                            vue.$data.jyxx2.shr = data.data[0].account;
                        }
                    }else{
                        cxAlert(data.mess);
                    }
                })
                //判断是借阅登记还是借阅审核
                this.$http.get('/getUser').then( function (result) {
                    var data = result.data;
                    if(data.code == 200){
                        vue.$data.jyxx2.jyr = data.data.name;
                        vue.$data.jyxx2.jyrId = data.data.id;
                        var roleId = data.data.roleId;
                        if(roleId === 1 || roleId === 2){
                            //借阅登记
                            this.jydj(this.showWs.dabh,this.showWs.wjmc,this.showWs.typeName,this.showWs.typeId,this.showWs.id);
                        }else {
                            //借阅申请
                            this.jysq(this.showWs.dabh,this.showWs.wjmc,this.showWs.typeName,this.showWs.typeId);
                        }
                    }
                });
            },
            //借阅登记
            jydj:function(dabh,xmmc,typeName,typeId,id){
                vue.$data.jyxx2.dabh = dabh;
                vue.$data.jyxx2.damc = xmmc;
                vue.$data.jyxx2.dalx = typeName;
                vue.$data.jyxx2.jyyy = "登记";
                vue.$data.jyxx2.jysx = 10;
                //vue.$data.jyxx2.shrId = 3;
                vue.$data.jyxx2.id = id;
                var myMsg = cxLoad("借阅登记中");
                $.get("/dalr/api/findDaByDabh",{"dabh":dabh,"tyepId":typeId}, function(result){
                    if(result.code == 200){
                        layer.close(myMsg);
                        $('#dadjtree').treeview('');
                        $('#dadjtree').treeview({
                            color: "#428bca",
                            highlightSelected:false,     //是否选中高亮显示
                            onhoverColor: "#f5f5f5",    //鼠标滑过的颜色
                            levels: 0 ,                 //设置初始化展开几级菜单 默认为2
                            showBorder:true,                //是否显示边框
                            showCheckbox:false,              //是否显示多选框
                            data:result.data.cl,
                            showTags:true,
                            showCheckbox: true,
                            silent:true,
                            //text:arr[0].xmmc,
                            //onNodeChecked: nodeChecked,
                            //onNodeUnchecked: nodeUnchecked,
                            //checked:true,
                            multiSelect: true,
                            //showTags:true,
                        });
                        for(var i = 0;i < result.data.cl.length;i++){
                            $('#dadjtree').treeview('checkNode', i);
                        }
                        $('#jydjDiv').modal('show');
                    }else {
                        layer.close(myMsg);
                    }
                });
            },
            //借阅申请
            jysq:function(dabh,xmmc,typeName,typeId){
                vue.$data.jyxx2.dabh = dabh;
                vue.$data.jyxx2.damc = xmmc;
                top.addTabs({
                    id: "19001117",
                    text: "借阅申请",
                    icon: "fa fa-tasks",
                    url: "jysq?dabh="+dabh+"&xmmc="+xmmc+"&typeName="+typeName+"&typeId="+typeId,
                    targetType: "iframe-tab",
                    close:true,
                });
            },
            suredj:function(){
                var selectedNodes = $('#dadjtree').treeview('getChecked');
                var arr = new Array();
                var arr2 = new Array();
                if(selectedNodes.length != 0){
                    for(var i = 0;i <selectedNodes.length;i++){
                        arr.push(selectedNodes[i].id);
                    }
                    this.jyxx2.clxxIds = arr;
                }else {
                    this.jyxx2.clxxIds = [];
                }
                var myMsg = cxLoad("借阅中");
                vue.$http.post('/jy/api/daJy',vue.$data.jyxx2).then( function (result) {
                    $('#userTable').bootstrapTable('showColumn', 'cz');
                    var data = result.body;
                    if(data.code == 200){
                        layer.close(myMsg);
                        cxAlertOk("借阅登记成功");
                        $('#jydjDiv').modal('hide');
                        vue.$data.jyxx2.jyyy = null;
                        vue.$data.jyxx2.jysx = null;
                    }else{
                        layer.close(myMsg);
                        cxAlert(data.mess);
                        vue.$data.jyxx2.jyyy = null;
                        //vue.$data.jyxx2.jysx = null;
                        //vue.$data.jyxx2.shrId = null;
                    }
                })
            },
            canceldj:function(){
                $('#jydjDiv').modal('hide');
            },
        },
        created: function () {
            $.get('/getUser').then( function (result) {
                var data = result.data;
                if(result.code == 200){
                    vue.$data.role = data.roleId;
                }
            });
            this.$http.get('/listShUser').then( function (result) {
                var data = result.body;
                if(data.code == 200){
                    this.allShy = data.data;
                }else{
                    cxAlert(data.mess);
                }
            })
        },
        mounted: function () {
            var that = this;
            var url = location.search;
            var typeId = url.substring(0,url.indexOf("&"));
            typeId = typeId.substring(typeId.indexOf("=")+1);
            var dabh = url.substring(url.indexOf("&")+1);
            dabh = dabh.substring(dabh.indexOf("=")+1);
            $.get("/dalr/api/findDaByDabh",{"dabh":dabh,"tyepId":typeId}, function(result){
                if(result.code == 200){
                    var keys = Object.keys(result.data.da);
                    for(var i = 0;i < keys.length;i++){
                        var key = keys[i];
                        if(result.data.da[key] == 'null'){
                            result.data.da[key] ="";
                        }
                    }
                    vue.$data.showWs = result.data.da;
                    $('#tree2').treeview({
                        color: "#428bca",
                        collapseIcon: "glyphicon glyphicon-minus",//可收缩的节点图标
                        // nodeIcon: "glyphicon glyphicon-user",
                        emptyIcon: "glyphicon glyphicon-folder-close",//设置列表树中没有子节点的节点的图标
                        expandIcon: "glyphicon glyphicon-plus",  //设置列表上中有子节点的图标
                        highlightSearchResults:true,//是否高亮搜索结果 默认true
                        highlightSelected:true,     //是否选中高亮显示
                        onhoverColor: "#f5f5f5",    //鼠标滑过的颜色
                        levels: 0 ,                 //设置初始化展开几级菜单 默认为2
                        //selectedIcon: 'glyphicon glyphicon-tint',
                        showBorder:true,                //是否显示边框
                        showCheckbox:false,              //是否显示多选框
                        data:result.data.cl,
                        showTags:true,
                        onNodeSelected:function(event, data) {
                            //弹窗
                            $('#jyDiv').modal('show');
                        },
                    });
                }
            });
        }
    });
</script>

</body>
</html>
